import React, { FC, HTMLAttributes } from 'react'
import './index.less'

const PRE_CLS = 'stdProcessCard'

interface ProgressCardProps extends HTMLAttributes<HTMLElement>{
  type: string
  stat: string
  desc: string
  date: string
}
const ProgressCard: FC<ProgressCardProps> = ({ type, stat, desc, date, className, ...restProps }) => (
  <section className={`${PRE_CLS} ${className}`} {...restProps}>
    <section className={`${PRE_CLS}Title`}>
      {type}
      <span className={`${stat.includes('完成') ? `${PRE_CLS}Success` : `${PRE_CLS}Pending`}`}>{stat}</span>
    </section>
    <section className={`${PRE_CLS}Desc`}>{desc || '-'}</section>
    <section className={`${PRE_CLS}Date`}>{date}</section>
  </section>
)

export default ProgressCard
